/* 整体的棋盘 */
html,
body {
  height: 100%;
  width: 100%;
}

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: rgba(217, 247, 255, 0.918);
  color: rgb(8, 0, 114);
  padding-top: 40px;
  padding-bottom: 40px;
}

/* 把1-9的数字，分成三列 */
#board {
  display: grid;
  grid-template-columns: 100px 100px 100px;
  grid-template-rows: 100px 100px 100px;
  /* 鼠标移动到格子里就变成一个手掌图标 */
  cursor: pointer;
  position: relative;
}

/* 重玩的按钮 */
button {
  background-color: transparent;
  color: currentColor;
  border: currentColor 1px solid;
  padding: 5px;
  font-size: 1.5em;
}
.div1 {
  width: 518px;
}

.div2 {
  width: 100px;
  height: 100px;
  float: left;
  margin-left: 3px;
  margin-top: 3px;
  background-color: #FFA042;
  text-align: center;
  font-size: 80px;
  color: #842B00;
}

.div3 {
  margin-top: 20px;
  width: 512px;
  height: 80px;
  /*border: solid;*/
  border-color: #000000;
  text-align: center;
}

.buttonStyle {
  width: 150px;
  height: 50px;
  font-size: 30px;
  margin-top: 15px;
  border-radius: 5%;
  background-color: #97CBFF;
}

.timeText {
  margin-left: 60px;
  font-size: 30px;
}

.inputStyle {
  float: auto;
  width: 100px;
  height: 30px;
  font-size: 30px;
}